<template>
  <div class="container">
    <el-select v-model="search.status" placeholder="请选择状态">
      <el-option
        v-for="item in options"
        :key="item.value"
        :label="item.label"
        :value="item.value"
      >
      </el-option>
    </el-select>
    <el-date-picker
      value-format="yyyy-MM-dd"
      v-model="date"
      type="daterange"
      :clearable="false"
      range-separator="至"
      start-placeholder="开始日期"
      end-placeholder="结束日期"
    ></el-date-picker>
    <el-button
      size="small"
      type="primary"
      icon="el-icon-search"
      class="handleSearch"
      @click="handleSearch()"
      >查询</el-button
    >
    <el-button
      size="small"
      type="danger"
      class="handleSearch"
      icon="el-icon-delete"
      @click="empty()"
      >清空</el-button
    >
    <el-button
      icon="el-icon-circle-plus"
      size="small"
      type="primary"
      @click="addCkeck"
      >添加</el-button
    >
    <el-button type="info" size="small" icon="el-icon-tickets" @click="derive()"
      >导出
    </el-button>
    <el-table
      max-height="600"
      :data="tableData"
      border
      style="width: 100%"
      empty-text="暂无数据"
    >
      <el-table-column
        prop="code"
        label="编码"
        align="center"
      ></el-table-column>
      <el-table-column
        prop="statusMsg"
        label="状态"
        align="center"
      ></el-table-column>
      <el-table-column
        prop="examine_time"
        label="审核时间"
        align="center"
      ></el-table-column>
      <el-table-column
        prop="warehouse_code"
        label="仓库编码"
        align="center"
      ></el-table-column>
      <el-table-column
        prop="warehouse_name"
        label="仓库名称"
        align="center"
      ></el-table-column>
      <el-table-column
        prop="created_at"
        label="创建时间"
        align="center"
      ></el-table-column>
      <el-table-column
        prop="admin_name"
        label="创建人"
        align="center"
      ></el-table-column>
      <el-table-column
        prop="examine_admin_name"
        label="审核人"
        align="center"
      ></el-table-column>
      <el-table-column label="操作" align="center" width="250px">
        <template slot-scope="scope">
          <el-button
            type="info"
            size="mini"
            icon="el-icon-info"
            @click="particulars(scope)"
            >详情</el-button
          >
          <el-button
            icon="el-icon-circle-plus"
            size="small"
            type="primary"
            @click="addCkeckDifference(scope)"
            >生成盘点差异单</el-button
          >
        </template>
      </el-table-column>
    </el-table>
    <el-dialog
      title="生成盘点计划单"
      :visible.sync="dialogVisible"
      width="300px"
      center
      @open="getDatas"
      @close="abolish"
    >
      <el-select
        size="small"
        v-model="purchase.value"
        :multiple="false"
        filterable
        remote
        center
        reserve-keyword
        placeholder="请选择仓库"
        :remote-method="insidePurchaseMethod"
        :loading="purchase.loading"
        @change="getPurchase(purchase.value)"
      >
        <el-option
          v-for="item in purchase.options"
          :key="item.value"
          :label="item.label"
          :value="item.value"
        ></el-option>
      </el-select>
      <span slot="footer" class="dialog-footer">
        <el-button @click="abolish">取 消</el-button>
        <el-button type="primary" @click="confirm">确 定</el-button>
      </span>
    </el-dialog>

    <!-- 分页 -->
    <pagination
      @page="handleSizeChange"
      @pagesize="handleCurrentChange"
      :pageData="pageData"
    ></pagination>
    <superPlanDetailsDialog
      :particularsDialog="particularsDialog"
    ></superPlanDetailsDialog>
    <!-- <superCheckGoodsDialog
      :addDialog="addDialog"
      @tag="getData"
    ></superCheckGoodsDialog> -->
  </div>
</template>
<script>
import { getToken } from "@/utils/auth";
import { parseTime, getnowDate } from "@/utils/index";
import SuperPlanDetailsDialog from "@/components/check/superPlanDetailsDialog";
import Pagination from "@/components/pagination";
import {
  getTakeStockPlanList,
  addTakeStockPlan,
  addTakestockByPlan
} from "@/api/check/superCheck";
import { selectChooseWarehouse } from "@/api/commodity/commodityList"; //仓库
// import SuperCheckGoodsDialog from "@/components/check/superCheckGoodsDialog";
export default {
  components: {
    pagination: Pagination,
    superPlanDetailsDialog: SuperPlanDetailsDialog

    // superCheckGoodsDialog: SuperCheckGoodsDialog,
  },
  data() {
    return {
      //页面数据
      tableData: [],
      //分页
      pageData: {
        pageSizes: [10, 20],
        pageSize: 10,
        page: 1,
        total: null,
        layout: "total, sizes, prev, pager, next, jumper"
      },
      //默认时间
      normal_startime: getnowDate().startimer,
      normal_endtime: getnowDate().endtimer,
      // addDialog: {
      //   centerDialogVisible: false,
      // },
      purchase: {
        innerVisible: false,
        options: [],
        value: "",
        type: false,
        list: [],
        loading: false
      },
      options: [
        {
          value: -1,
          label: "全部"
        },
        {
          value: 1,
          label: "待审核"
        },
        {
          value: 2,
          label: "已审核"
        }
      ],
      search: {
        status: "",
        start_time: "",
        end_time: ""
      },
      date: [],
      particularsDialog: {
        centerDialogVisible: false,
        code: ""
      },
      dialogVisible: false,
      warehouse: {
        warehouse_code: "",
        warehouse_name: ""
      }
    };
  },
  created() {
    this.search.start_time = this.normal_endtime;
    this.search.end_time = this.normal_endtime;
    if (this.normal_endtime) {
      this.date.push(this.search.end_time);
    }
    if (this.normal_endtime) {
      this.date.push(this.search.end_time);
    }
    this.getData();
  },
  methods: {
    //获取页面数据
    getData() {
      let data = {
        limit: this.pageData.pageSize,
        page: this.pageData.page,
        status: this.search.status == -1 ? "" : this.search.status,
        start_date: this.search.start_time,
        end_date: this.search.end_time
      };

      getTakeStockPlanList(data)
        .then(res => {
          if (res.code == 0) {
            res.data.data.forEach(item => {
              item.statusMsg = item.status == 1 ? "未审核" : "已审核";
            });
            this.tableData = res.data.data;
            this.pageData.page = res.data.current_page;
            this.pageData.pagesize = res.data.per_page;
            this.pageData.total = res.data.total;
          }
        })
        .catch(err => {
          console.log(err);
        });
    },
    getDatas() {
      //获取仓库列表
      let data = {
        page: 1,
        limit: 100
      };
      selectChooseWarehouse(data).then(res => {
        this.purchase.options = res.data.data.map(item => {
          return {
            value: `${item.house_code}`,
            label: `${item.house_name}`
          };
        });
      });
    },
    // 嵌套搜索仓库数据
    insidePurchaseMethod(query) {
      if (query !== "") {
        this.getPurchaseList(query);
      } else {
        this.purchase.options = [];
      }
    },
    getPurchaseList(query) {
      let data = {
        name: query,
        page: 1,
        limit: 100
      };
      this.purchase.loading = true;
      selectChooseWarehouse(data).then(res => {
        this.purchase.list = res.data.data.map(item => {
          return {
            value: `${item.house_code}`,
            label: `${item.house_name}`
          };
        });
        this.purchase.loading = false;
        this.purchase.options = this.purchase.list.filter(item => {
          return item.label.toLowerCase().indexOf(query.toLowerCase()) > -1;
        });
      });
    },
    getPurchase(e) {
      let data = this.purchase.options.filter(res => {
        return res.value == e;
      });
      this.warehouse = {
        warehouse_code: data[0].value,
        warehouse_name: data[0].label
      };
    },
    //详情
    particulars(scope) {
      this.particularsDialog.centerDialogVisible = true;
      this.particularsDialog.code = scope.row.code;
    },
    // 搜索
    handleSearch() {
      if (this.date.length > 0) {
        this.search.start_time = this.date[0];
        this.search.end_time = this.date[1];
      }
      this.pageData.page = 1;
      this.pageData.total = null;
      this.getData();
    },
    // 清空
    empty() {
      this.date = [];
      this.search = {
        status: "",
        start_time: "",
        end_time: ""
      };
      this.search.start_time = this.normal_endtime;
      this.search.end_time = this.normal_endtime;
      this.date.push(this.normal_endtime);
      this.date.push(this.normal_endtime);
    },

    //导出
    derive() {
      this.$confirm("是否导出?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          if (this.date.length > 0) {
            this.search.start_time = this.date[0];
            this.search.end_time = this.date[1];
          }
          let status = this.search.status == -1 ? "" : this.search.status;
          let link = document.createElement("a");
          link.href =
            this.$axios.defaults.baseURL +
            "/smkapi/Takestock/exportTakeStockPlanList?token=" +
            getToken() +
            "&status=" +
            status +
            "&start_date=" +
            this.search.start_time +
            "&end_date=" +
            this.search.end_time;
          link.click();
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消导出"
          });
        });
    },
    //添加盘点计划单
    addCkeck() {
      this.dialogVisible = true;
    },
    //添加盘点计划单取消
    abolish() {
      this.warehouse = {
        warehouse_code: "",
        warehouse_name: ""
      };
      this.purchase = {
        innerVisible: false,
        options: [],
        value: "",
        type: false,
        list: [],
        loading: false
      };
      this.dialogVisible = false;
    },
    confirm() {
      let data = {
        warehouse_code: this.warehouse.warehouse_code,
        warehouse_name: this.warehouse.warehouse_name
      };
      console.log(data);
      addTakeStockPlan(data).then(res => {
        if (res.code == 0) {
          this.$message({
            type: "success",
            message: res.msg || res.message
          });
          this.abolish();
          this.getData();
        } else {
          this.$message({
            type: "info",
            message: res.msg || res.message
          });
        }
      });
    },
    //生成盘点差异单
    addCkeckDifference(scope) {
      this.$confirm("是否添加盘点计划单?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          let data = {
            code: scope.row.code
          };
          addTakestockByPlan(data).then(res => {
            if (res.code == 0) {
              this.$message({
                type: "success",
                message: res.msg || res.message
              });
              this.getData();
            } else {
              this.$message({
                type: "info",
                message: res.msg || res.message
              });
            }
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消"
          });
        });
    },
    //添加盘点单商品
    // addSuperCheckGoods() {
    //   this.addDialog.centerDialogVisible = true;
    // },

    //每页多少条
    handleCurrentChange(val) {
      this.pageData.page = 1;
      this.pageData.pageSize = val;
      this.getData();
    },
    //选取页数
    handleSizeChange(page) {
      this.pageData.page = page;
      this.getData();
    }
  }
};
</script>
<style scoped>
.add {
  position: absolute;
  right: 0;
  top: 4px;
}
.pagination {
  text-align: right;
  padding: 10px;
}
</style>
